<template>
    <el-row>
        <el-col :span="24" class="blog-container">
            <!--左侧博文部分-->
            <el-col :span="18">
                <div>
                    <!--课程详情内容组件-->
                    <MyCourseDetailsLefter ref="myCourseDetailsLefter"></MyCourseDetailsLefter>
                </div>
            </el-col>
            <!--右侧广告部分-->
            <el-col :span="6">
                <!--课程页面右侧组件-->
                <MyCourseDetailsRighter @showChapterMenuCurrentAid="showChapterMenuCurrentAid"></MyCourseDetailsRighter>
            </el-col>
        </el-col>
    </el-row>
</template>

<script>
    import MyCourseDetailsRighter from "@/components/pc/MyCourseDetailsRighter";
    import MyCourseDetailsLefter from "@/components/pc/MyCourseDetailsLefter";

    export default {
        name: "MyCourseDetailsContainer",
        components:{
            MyCourseDetailsRighter,
            MyCourseDetailsLefter
        },
        data() {
            return{

            }
        },
        computed: {},
        mounted() {
            //this.refreshArticleList('all');
        },
        methods: {
            showChapterMenuCurrentAid(aid){
                console.log("在父组件中=>当前的文章编号："+aid);
                this.$refs.myCourseDetailsLefter.refreshCurrentArticle(aid);
            }
        }
    }
</script>

<style scoped>
    .blog-container {
        width: 100%;
        margin: 0px;
        display: flex;
        padding: 10px;
        align-content: space-around;
    }

</style>